<template>
    <div class="content-footer">
        <div class="footer-left">
            <div class="left-item project-name">
                <div>项目名称:{{projectName}}</div>
            </div>
            <div class="left-item operator">
                <div>当前操作员:{{userName}}</div>
            </div>
        </div>
        <div class="bottom-tag">
            <span>Copyright © 2019 现场审计作业云平台系统 - Powered By CCB V1.0.0</span>
        </div>

    </div>
</template>

<script>
    export default {
        name: "BottomTip",
        data(){
            return {
                projectName:'上市经济审计',
                userName:'审计一组'
            }
        }
    }
</script>

<style lang="less" scoped>
    //   内容面板底部
    .content-footer {
        width: 100%;
        height: 40px;
        position: relative;
        bottom: 0;
        left: 0;
        z-index: 900;
        box-sizing: border-box;
        padding: 0 20px;
        background-color: #fff;
        font-size: 12px;
        color: #333333;
        line-height: 40px;
        display: flex;
        justify-content: space-between;

    .left-item {
        padding: 0 20px 0 17px;
        display: inline-block;
        position: relative;

    span {
        margin: 0 20px 0 17px;
    }
    }

    .left-item::before {
        content: "";
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #fda534;
        position: absolute;
        left: 0px;
        top: 15px;
    }

    .operator::before {
        background-color: #319167;
    }

    .accounting-data::before {
        background-color: #ff3a36;
    }

    .footer-right {
        font-size: 14px;
        color: #333333;
        letter-spacing: 0;
        text-align: center;
    }

    .bottom-tag {
        position: absolute;
        left: calc(50% - 191px);
        top: 0;
        font-size: 12px;
        height: 100%;
        line-height: 40px;
        color: #999999;
        letter-spacing: 0;
    }
    }
</style>